import Vue from 'vue'
import {URL_BAOTOU_WEATHER} from '../global'
var vue = new Vue();
import * as layerNames from '../config/index'
const weather_api= {

    addBaotouAdminSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        // $.get('./dist/data/administrate/new/baotou_administrate.json', function (data) {

        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            var source = {
                "type": "FeatureCollection",
                "features": [{
                    "type": "Feature",
                    "geometry": {
                        "type": "Point",
                        "coordinates": [109.958855,40.67488]
                    },
                    "properties": {
                        "name": "包头市",
                        "center": [109.878855,40.65488],
                        "iconType": weatherType,
                    }
                }]
            }
            map.addSource("administrativePoint",
                {
                "type": "geojson",
                "data": source
            });
            map.addSource("administrativePolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiLayer(map);
        });
    },
    addBaotouAdminiLayer: function (map,weatherType) {

        map.addLayer({
            "id": "administrativePolygon",
            "type": "fill",
            "source": "administrativePolygon",
            "minzoom": 0,
            "maxzoom": 16,
            "paint": {
                "fill-opacity":0.2,
                "fill-color": "#EEDFCC",
            }
        });
        map.addLayer({
            "id": "administrativePoint",
            "type": "symbol",
            "source": "administrativePoint",
            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    addBaotouAdminBaiyunSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        // $.get('../../static/data/regiondata/new/baiyun_administrate.json', function (data) {
        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeBaiyunLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            map.addSource("administrativeBaiyunPoint", {
                "type": "geojson",
                "data": dataCollection[1]
            });
            map.addSource("administrativeBaiyunPolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiBaiyunLayer(map);
        });
    },
    addBaotouAdminiBaiyunLayer: function (map,weatherType) {
        map.addLayer({
            "id": "administrativeBaiyunPolygon",
            "type": "fill",
            "source": "administrativeBaiyunPolygon",
            "minzoom": 0,
            "maxzoom": 16,
            "paint": {
                "fill-opacity":0.7,
                "fill-color": "#EEDFCC"
            }
        });
        map.addLayer({
            "id": "administrativeBaiyunPoint",
            "type": "symbol",
            "source": "administrativeBaiyunPoint",

            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    addBaotouAdminDamaoSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        // $.get('../../static/data/regiondata/new/damao_administrate.json', function (data) {
        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeDamaoLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            map.addSource("administrativeDamaoPoint", {
                "type": "geojson",
                "data": dataCollection[1]
            });
            map.addSource("administrativeDamaoPolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiDamaoLayer(map);
        });
    },
    addBaotouAdminiDamaoLayer: function (map,weatherType) {
        map.addLayer({
            "id": "administrativeDamaoPolygon",
            "type": "fill",
            "source": "administrativeDamaoPolygon",
            "minzoom": 0,
            "maxzoom": 16,
             "paint": {
                "fill-opacity":0.7,
                "fill-color": "#EEEED1"
            }
        });
        map.addLayer({
            "id": "administrativeDamaoPoint",
            "type": "symbol",
            "source": "administrativeDamaoPoint",

            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    addBaotouAdminGuyangSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        // $.get('./dist/data/administrate/new/guyang_administrate.json', function (data) {
        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeGuyangLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            map.addSource("administrativeGuyangPoint", {
                "type": "geojson",
                "data": dataCollection[1]
            });
            map.addSource("administrativeGuyangPolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiGuyangLayer(map);
        });
    },
    addBaotouAdminiGuyangLayer: function (map,weatherType) {
        map.addLayer({
            "id": "administrativeGuyangPolygon",
            "type": "fill",
            "source": "administrativeGuyangPolygon",
            "minzoom": 0,
            "maxzoom": 16,
             "paint": {
                "fill-opacity":0.7,
                "fill-color": "#EEE9E9"
            }
        });
        map.addLayer({
            "id": "administrativeGuyangPoint",
            "type": "symbol",
            "source": "administrativeGuyangPoint",

            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    addBaotouAdminTuyouSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        // $.get('../../static/data/regiondata/new/tuyou_administrate.json', function (data) {
        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeTuyouLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            map.addSource("administrativeTuyouPoint", {
                "type": "geojson",
                "data": dataCollection[1]
            });
            map.addSource("administrativeTuyouPolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiTuyouLayer(map);
        });
    },
    addBaotouAdminiTuyouLayer: function (map,weatherType) {
        map.addLayer({
            "id": "administrativeTuyouPolygon",
            "type": "fill",
            "source": "administrativeTuyouPolygon",
            "minzoom": 0,
            "maxzoom": 16,
             "paint": {
                "fill-opacity":0.7,
                "fill-color": "#EEEED1"
            }
        });
        map.addLayer({
            "id": "administrativeTuyouPoint",
            "type": "symbol",
            "source": "administrativeTuyouPoint",

            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    addBaotouAdminQingshanSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        // $.get('../../static/data/regiondata/new/tuyou_administrate.json', function (data) {
        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeQingshanLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            map.addSource("administrativeQingshanPoint", {
                "type": "geojson",
                "data": dataCollection[1]
            });
            map.addSource("administrativeQingshanPolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiQingshanLayer(map);
        });
    },
    addBaotouAdminiQingshanLayer: function (map,weatherType) {
        map.addLayer({
            "id": "administrativeQingshanPolygon",
            "type": "fill",
            "source": "administrativeQingshanPolygon",
            "minzoom": 0,
            "maxzoom": 16,
             "paint": {
                "fill-opacity":0.7,
                "fill-color": "#660000"
            }
        });
        map.addLayer({
            "id": "administrativeQingshanPoint",
            "type": "symbol",
            "source": "administrativeQingshanPoint",

            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    addBaotouAdminDongheSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        // $.get('../../static/data/regiondata/new/Donghe_administrate.json', function (data) {
        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeDongheLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            map.addSource("administrativeDonghePoint", {
                "type": "geojson",
                "data": dataCollection[1]
            });
            map.addSource("administrativeDonghePolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiDongheLayer(map);
        });
    },
    addBaotouAdminiDongheLayer: function (map,weatherType) {
        map.addLayer({
            "id": "administrativeDonghePolygon",
            "type": "fill",
            "source": "administrativeDonghePolygon",
            "minzoom": 0,
            "maxzoom": 16,
             "paint": {
                "fill-opacity":0.7,
                "fill-color": "#006600"
            }
        });
        map.addLayer({
            "id": "administrativeDonghePoint",
            "type": "symbol",
            "source": "administrativeDonghePoint",

            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    addBaotouAdminJiuyuanSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeJiuyuanLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            map.addSource("administrativeJiuyuanPoint", {
                "type": "geojson",
                "data": dataCollection[1]
            });
            map.addSource("administrativeJiuyuanPolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiJiuyuanLayer(map);
        });
    },
    addBaotouAdminiJiuyuanLayer: function (map,weatherType) {
        map.addLayer({
            "id": "administrativeJiuyuanPolygon",
            "type": "fill",
            "source": "administrativeJiuyuanPolygon",
            "minzoom": 0,
            "maxzoom": 16,
            "paint": {
                "fill-opacity":0.7,
                "fill-color": "#CCF3FF"
            }
        });
        map.addLayer({
            "id": "administrativeJiuyuanPoint",
            "type": "symbol",
            "source": "administrativeJiuyuanPoint",
            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    addBaotouAdminKunlunquSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeKunlunquLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            map.addSource("administrativeKunlunquPoint", {
                "type": "geojson",
                "data": dataCollection[1]
            });
            map.addSource("administrativeKunlunquPolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiKunlunquLayer(map);
        });
    },
    addBaotouAdminiKunlunquLayer: function (map,weatherType) {
        map.addLayer({
            "id": "administrativeKunlunquPolygon",
            "type": "fill",
            "source": "administrativeKunlunquPolygon",
            "minzoom": 0,
            "maxzoom": 16,
             "paint": {
                "fill-opacity":0.7,
                "fill-color": "#666600"
            }
        });
        map.addLayer({
            "id": "administrativeKunlunquPoint",
            "type": "symbol",
            "source": "administrativeKunlunquPoint",

            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    addBaotouAdminShiguaiSource: function (map,sourceDataLoc,weatherType) {
        var that = this;
        // $.get('../../static/data/regiondata/new/Shiguai_administrate.json', function (data) {
        $.get(sourceDataLoc, function (data) {
            var dataCollection = that.administrativeDataWrapper(data.data,weatherType)
            map.addSource("administrativeShiguaiLine", {
                "type": "geojson",
                "data": dataCollection[0]
            });
            map.addSource("administrativeShiguaiPoint", {
                "type": "geojson",
                "data": dataCollection[1]
            });
            map.addSource("administrativeShiguaiPolygon", {
                "type": "geojson",
                "data": dataCollection[2]
            });
            that.addBaotouAdminiShiguaiLayer(map);
        });
    },
    addBaotouAdminiShiguaiLayer: function (map,weatherType) {
        map.addLayer({
            "id": "administrativeShiguaiPolygon",
            "type": "fill",
            "source": "administrativeShiguaiPolygon",
            "minzoom": 0,
            "maxzoom": 16,
             "paint": {
                "fill-opacity":0.7,
                "fill-color": "#006666"
            }
        });
        map.addLayer({
            "id": "administrativeShiguaiPoint",
            "type": "symbol",
            "source": "administrativeShiguaiPoint",

            "minzoom": 0,
            "maxzoom": 16,
            "layout": {
                "icon-image": "hospital-15",
                "text-field": "{name}",
                "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
                "text-offset": [0, 2.6],
                "text-anchor": "bottom"
            },
            "paint": {
                "icon-color": "red",
                "text-color":"#333333"
            }
        });
    },
    /*
    getWeather: function (sourceDataLoc) {
        // $.get("../../static/data/regiondata/weather.xml", function (data) {
        $.get(sourceDataLoc, function (data) {
            //console.log(data);
            $(data).find('Profiles').find('Weather').each(function (index, ele) {
                var titles = $(ele).find('city').text();
                console.log(titles);
                _view_.getWeatherCtrl().append(_templete_.weatherHeader());
                _eventRegister_.init();
            })
        });
    }*/

    administrativeDataWrapper: function (datas,weatherType) {
        var _out = {
            "type": "FeatureCollection",
            "features": []
        }
        var _out_point = {
            "type": "FeatureCollection",
            "features": []
        }
        var _out_polygon = {
            "type": "FeatureCollection",
            "features": []
        }
        for (var i = 0; i < datas.length; i++) {
            var data = datas[i];
            var item = {
                "type": "Feature",
                "geometry": {
                    "type": "LineString",
                    "coordinates": data.data
                },
                "properties": {
                    "name": data.name,
                    "center": data.center
                }
            }
            var item1 = {
                "type": "Feature",
                "geometry": {
                    "type": "Point",
                    "coordinates": data.center
                },
                "properties": {
                    "name": data.name,
                    "center": data.center,
                    "iconType": weatherType,
                }
            }
            var item2 = {
                "type": "Feature",
                "geometry": {
                    "type": "Polygon",
                    "coordinates": [data.data]
                },
                "properties": {
                    "name": data.name,
                    "center": data.center
                }
            }
            _out.features.push(item);
            _out_point.features.push(item1);
            _out_polygon.features.push(item2);
        }
        return [_out, _out_point,_out_polygon];
    },



    parseWeatherData:function(weatherJson){
        var weatherFormat = {}
        weatherJson.map(function (weatherData) {
            var key = weatherData.admin_id
            weatherFormat[key] = weatherData
        })
        return weatherFormat
    },

    getWeatherForecast : function(){
        var that = this
        vue.$http.get(URL_BAOTOU_WEATHER).then((response) => {
            console.log("wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww");
            console.log(eval(response.data));
            var weatherFormat = that.parseWeatherData(eval(response.data.data));
            return weatherFormat
        }, (response) => {
            console.log(response.json());
        });
    },
}


export default weather_api